En su día hice una pequeña guía de cómo agregar un link a una imagen, hoy he querido detallar ese explicación dedicando esta entrada a Isa que desea aplicar en su blog un buscador personalizado de Google.
Tratándose de Google y de una página dedicada a un bebé he escogido para el ejemplo esta imagen (Por supuesto vale cualquier otra)


Lo primero que debemos hacer es alojar esa imagen en un servidor para conseguir la Url de la imagen, podemos subirla a Blogger en una entrada aunque yo suelo utilizarImageshack por aquello que nos facilita modificar el tamaño de la imagen. Una vez alojada la imagen la Url que nos proporciona es:

http://img517.imageshack.us/img517/6779/earthmday05hl2.gif

Dejamos en espera lo que estamos haciendo y abrimos la página de Goglogo donde nos proporcionará el logotipo personalizado de Google y la Url que vamos a necesitar más adelante. La dirección Url que nos proporciona es:

http://www.goglogo.com/s.asp?lo=Javier

Ya tenemos la dos direcciones que nos hacen falta, una para la imagen y otra para la página que será enlazada, ahora nos situamos en nuestro blog por este orden:

Panel/Diseño/Plantilla/Añadir un elemento de página/HTML/Javascript

Dejaremos en blanco el espacio del título, y en Contenido añadiremos lo siguiente:

<a href='aqui la url de la pagina'>
<img border='0' height='100' src='aqui la url de la imagen ' width='200'/></a>

Seguidamente debemos agregar la Url como indica el código, donde dice aquí la url de la imagen pegaremos la Url de la imagen de Imageshack que tenemos en espera. Donde dice aquí la url de la página añadiremos la Url proporcionada por Goglogo.

Quedaría algo así:


<a href='http://www.goglogo.com/s.asp?lo=Javier'>
<img border='0' height='100' src='http://img517.imageshack.us/img517/6779/earthmday05hl2.gif ' width='200'/></a>


Los valores width y height son una opción de orientación y ayuda para modificar el tamaño de la imagen que hará de enlace, si tenemos el tamaño deseado podemos prescindir de ello y agregar simplemente:


<a href="http://www.goglogo.com/s.asp?lo=Javier">
<img src="http://img517.imageshack.us/img517/6779/earthmday05hl2.gif" /></a>



Guardamos los cambios y ya solamente nos queda arrastrar esa etiqueta hasta el lugar que deseamos aparezca nuestra imagen, en este caso el buscador personalizado.

Clica en la imagen para ver a mayor tamaño



Eso es todo... !Suerte¡

Anónimo

Estimada Gema
Darte las gracias por tu ayuda.Hoy mismo me pondré a ello, la verdad que eres estupenda. Persona dadas de esta manera, hoy en día son un lujo. Pues la mayoría piden cosas a cambio, y la verdad que el altruismo como que ya no... Gracias, miles de gracias. Te haré un pequeño homenaje en el blog, para que Javi cuando crezca conozca a la persona que esta ayuda a su madre hacer el blog que el podrá disfrutar.
Gracias. Ya te avisaré como me ha ido todo. Besotes, Isa

Responder
Anónimo

Estimada Gema
He añadido tu enlace y no sale nada, ni si quiera da error. ¿No será compatible con algo?. La verdad que hasta ya me siento mal por darte el coñazo.Lo he añadido tal y como dices y nada, el blog se me queda tal y como esta http://danyeisa.blogspot.com/. De verás que me siento ya hasta violenta. Pues me lo has explicado tan bien y tan fácil que ya no había perdiciendo. Pero resulta que no sale ¿habrá que esperar tiempo?. Lo siento. Deseo no tener que molestarte más. Busco solo lo mejor y por ahora solo cuento con tu ayuda. Atentamente, Isa

Responder
Gem@

Hola Isa,
Entiendo que te desanimes un poco si algo no sale como esperamos pero no porque tengas que recurrir a preguntar de nuevo, ni mucho menos pensar que molestas.
Yo empecé preguntando como tú y la mayoría de los que mantenemos un blog, la diferencia es que algunos llevamos un tiempo dedicado a esto y tú has empezado ahora la diferencia es palpable ;)
Ahora olvidemos todo lo que has dicho en los comentarios anteriores ¿OK?

En la entrada he señalado en color azul el código que debes copiar y pegar en el blog, yo he probado en tres blogs diferentes y el resultado es el esperado.
Prueba de nuevo, estos días pasados Blogger no anda muy bien a mi me ha pasado guardar cambios y quedarse colgado con el típico texto de ´´guardando... guardando.. guardando..`` y no actualizarse la página bien, no sé si me explico.
Cuando subas el código al blog y guardes los cambios si no se visiona la imagen pulsa la tecla F5 para actualizar la página, a lo mejor así conseguimos que aparezca.
Y si aún así no funciona lo intentamos de mil maneras diferentes.
Ánimo Isa que tú puedes ;)

Responder
Anónimo

Estimada Gema
Gracias por tu paciencia. Tenías razón esta tarde lo he vuelto a intentar y me ha salido. Pero una duda que tengo ¿es un enlace lo que tiene que salir?. Pues pensaba yo que saldría la ventanita como sale en las páginas web ¿no se si me explico?. De todas maneras gracias, estoy muy ilusionada y animada por tu ayuda y comprensión. Gracias de veras.Ahora me gustaría probar el cambiar el tamaño, pues se me ha quedado un poco pequeño.
Gracias de verás. Y ya cuando hayas mirado lo de la música ya me dirás ok?. Besotes Isa

Responder
Gem@

Hola Isa ese generador de Goglogo como bien dices es un enlace, si lo que deseas es algo parecido a lo que hay en mi blog pero en vez de buscar dentro del blog que lo haga en Google, también se puede hacer, pero no lleva a la página que creaste de Javier sino a la página oficial de Google.
Lo del tamaño puedes arreglarlo si añades el otro código de la entrada ahora en color amarillo.
Sigue en mente lo de la música :)

Responder
tejeh dony

Gracias por ayudarnos y en especial a mi que me cuesta tanto esto de codigos me marea pero me gusta .
Hace unos años terminè la primaria,secundaria de noche y ya con mis muchos años, nunca imagine estar hoy en dia haciendo estas cositas que para mi es mucho muchooo .
Mire las cositas que he coloque en mi blog Gracias a usted que es una MAESTRA .
besitos =Donny

Responder
Gem@

yz Hola Donny me alegra mucho leer tu comentario, veo que tu si que eres toda una maestra.
Han quedado lindos tus blogs :)

Responder
lo mejor de la web

hola , mira tengo una duda muy grande ojala me puedan alludar :(:(:(:(
sucede que quiero ponerle a mi blog un links k diga haci :
Accede a la entrada haciendo click AQUI..

y hice algo que salia aqui en este blog, pero lamentablemente no me resulto. ya que tengo un blog de descarga de dvdr y necesito que solo se vea la imagen de la pelicula y en enlace ..

ojala me puedan ayudar..
muchas gracias de antemano..

Responder
Gem@

:: lo mejor de la web, un enlace sería así:
<a href="url-de-la-entrada">click AQUI..</a>
Donde dice url-de-la-entrada debes sustituirlo por la url de la entrada que deseas mostrar, para eso debes visualizar la entrada completa en la página principal del blog por ejemplo marcas sobre el título y se muestra la entrada completa, luego copias la url que aparece en ese momento en la barra del navegador y la pegas donde dice url-de-la-entrada
Un ejemplo para enlazar la entrada de "BASTARDOS SIN GLORIA"

<a href="http://lomejordvdr.blogspot.com/2009/12/dvd-full-bastardos-sin-gloria_9788.html">click AQUI..</a>

Responder
Shiquita

a mi me gustaria saber como colocar varias imagenes, una al lado de la otra en el ecabezado, y cuando hagan click en una imagen los mande a la url que yo quiero, e probado miles de cosas pero todas son para una sola imagen y no varias, una al lado de la otra en forma horizontal de antemano muchas gracias

Responder
Gem@

:: Shiquita para poner una imagen al lado de otra simplemente hay que poner el código de la imagen uno al lado de otro, se puede añadir un enlace para cada imagen o envolver las imágenes (todas) con un solo enlace, puedes hacerlo así:

<a href="url-pagina">
<img src="url-imagen"/><img src="url-imagen"/><img src="url-imagen"/></a>

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top